<div class="modal" ng-controller="DecisionTableHitPolicyEditorCtrl">
  <div class="modal-dialog">
    <div class="modal-content">
      <form name="inputExpressionForm">
        <div class="modal-header"><h2>Select Decision Table Hit Policy</h2>
        </div>
        <div class="modal-body">

          <!--Column name start-->
          <div class="clearfix form-group">
            <div class="col-xs-4">
              <label>Hit Policy</label>
            </div>
            <div class="col-xs-8" ng-if="!model.readOnly">
              <select class="form-control" id="hitPolicy" name="hitPolicy" ng-model="popup.currentHitPolicy">
                <option ng-repeat="option in popup.availableHitPolicies"
                        ng-selected="{{option.id == popup.currentHitPolicy}}" value="{{option.id}}">
                  {{option.label | translate}}
                </option>
              </select>
            </div>
            <div class="col-xs-8" ng-if="model.readOnly">
              <div>{{popup.currentHitPolicy}}</div>
            </div>
            <div class="col-xs-12"><br/></div>
            <div class="col-xs-4" ng-if="popup.currentHitPolicy === 'COLLECT'">
              <label>Collect operator</label>
            </div>
            <div class="col-xs-8" ng-if="popup.currentHitPolicy === 'COLLECT' && !model.readOnly">
              <select class="form-control" id="collectOperator" name="collectOperator"
                      ng-model="popup.currentCollectOperator">
                <option selected="selected" value="">None</option>
                <option ng-repeat="option in popup.availableCollectOperators"
                        ng-selected="{{option.id == popup.currentCollectOperator}}" value="{{option.id}}">
                  {{option.label | translate}}
                </option>
              </select>
            </div>
            <div class="col-xs-8" ng-if="popup.currentHitPolicy === 'COLLECT' && model.readOnly">
              <div>{{popup.currentCollectOperator}}</div>
            </div>
          </div>
        </div>

        <div class="modal-footer">
          <div class="pull-right">
            <button class="btn btn-sm btn-default" ng-click="cancel()" type="button">
              {{'GENERAL.ACTION.CANCEL' | translate}}
            </button>
            <button class="btn btn-sm btn-default" ng-click="save()"
                    ng-disabled="!inputExpressionForm.$valid || readOnly" ng-if="!model.readOnly"
                    type="button">
              {{'GENERAL.ACTION.SAVE' | translate}}
            </button>
          </div>
          <div class="loading pull-right" ng-show="model.loading">
            <div class="l1"></div>
            <div class="l2"></div>
            <div class="l2"></div>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>
